import React, { Component } from "react";
import { connect } from "react-redux";
import { increment, decrement } from "../../store/actions/app";
import { increment as sup, decrement as sub } from "../../store/actions/user";
class App extends Component {
  render() {
    const { app_counter, user_counter } = this.props;
    return (
      <div>
        <h1>app当前计数为： {app_counter}</h1>
        <h1>user当前计数为： {user_counter}</h1>
        <h2>app</h2>
        <button onClick={() => this.props.decrement()}>-</button>
        <button onClick={() => this.props.increment()}>+</button>
        <br />
        <h2>user</h2>
        <button onClick={() => this.props.sub()}>-</button>
        <button onClick={() => this.props.sup()}>+</button>
      </div>
    );
  }
  componentDidMount() {
    // this.props.getTodos();
  }
}
const mapStateToProps = (state) => {
  console.log(state);
  return {
    app_counter: state.app.counter,
    user_counter: state.user.counter,
  };
};

const mapDispatchToProps = (dispatch) => {
  return {
    decrement() {
      dispatch(decrement());
    },
    increment() {
      dispatch(increment());
    },
    sub() {
      dispatch(sub());
    },
    sup() {
      dispatch(sup());
    },
  };
};
export default connect(mapStateToProps, mapDispatchToProps)(App);
